<script lang="ts" setup>
  import { ref } from 'vue';
  import Pagination from '@sscd/pagination';
  const current1 = ref<number>(1);
  const current2 = ref<number>(2);
  const pageSize1 = ref<number>(20);
  const pageSize2 = ref<number>(20);
</script>

<template>
  <div class="demo">
    <div class="demo-title">总数</div>
    <div class="demo-content">
      <Pagination
        v-model:current="current1"
        v-model:page-size="pageSize1"
        :total="85"
        :show-total="(total) => `Total ${total} items`"
      />
      <br />
      <Pagination
        v-model:current="current2"
        v-model:page-size="pageSize2"
        :total="85"
        :show-total="(total, range) => `${range[0]}-${range[1]} of ${total} items`"
      />
    </div>
  </div>
</template>
